/*CSS for Social network - Utrinki */

/* 
    Document   : utrinki
    Created on : Dec 19, 2011, 5:16:49 PM
    Author     : Benedikta
    Description:
        Purpose of the stylesheet follows.
*/

/* -- LAYOUT -- */
*{
	margin: 0px auto;
	padding: 0px;
	}
body{
	font-size: 11px;
        font-family: "trebuchet ms", Helvetica;
        background-image: url("Frontpage/background.jpg");
	}
        .header{
            position: absolute;
            float: left;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 80px;
            background-color: #092e61;           
        }
        .contents{
            position: relative;
            width: 900px;
            margin-right: auto;
            margin-left: auto;
            background-image: url("Frontpage/container.jpg");
            background-repeat: repeat-y;
            top: 80px;  
            padding-bottom: 40px;
            padding-top: 20px;
        }
        .login{
            position: relative;
            width: 450px;
            height: 450px;
            margin-right: auto;
            margin-left: auto;
            background-color: #1f5191;
            
            border-top-left-radius: 18px;
            border-top-right-radius: 18px;
            border-bottom-left-radius: 18px;
            border-bottom-right-radius: 18px;
        } 
        .footer{
            position: relative;
            width: 900px;
            height: 20px;
            margin-right: auto;
            margin-left: auto;                      
            background-image: url("Frontpage/container1.jpg");
            color: #317fcc;
            font-size: 8px; 
            text-align: center;            
            clear: both;
            margin-top: 60px;            
        }
        .button_style{
            cursor: pointer;
            background-color: #b9daf8;
            width: 100px;
            height: 25px;
            color: #317fcc;
            font-weight: bold;
            border: 2px solid #6fade5;
            border-top-left-radius: 13px;
            border-top-right-radius: 13px;
            border-bottom-left-radius: 13px;
            border-bottom-right-radius: 13px;
        }
        .left{
            position: relative;
            margin: 10px;
            min-width: 60%;
            padding: 10px; 
            overflow: hidden;            
        }
        .right{
            position: absolute;
            height: 200px;
            top: 40px;
            right: 0px;
            width: 23%;
            background-color: #1f5191;
            padding: 22px;
            margin-right: 10px;          
            
            border-top-left-radius: 13px;
            border-top-right-radius: 13px;
            border-bottom-left-radius: 13px;
            border-bottom-right-radius: 13px;
        }
        
/* -- TOP PANEL -- */
.main_top{
    width: 25%;
    position: relative;
    margin-left: auto;
    margin-right: auto;  
    height: 80px;
}
.stars{
    width: 50%;
    float: left;   
}
.main_title{
    width: 50%;
    font-size: 30px;
    font-weight: bolder;
    float: right;
    color: white;
    margin-bottom: 2px;
}

/* -- LOGIN PANEL -- */
h2.login_title{
    padding: 30px;
    font-size: 28px;
    font-weight: bolder;
    text-align: center;
    color: white;
}
#login_form{
    text-align: center;
    color: #78b5ed;
    font-size: 13px;
}
.table_td{
    text-align: left;
    padding-bottom: 3px;
    padding-top: 3px; 
    padding-right: 5px;
}
.table_td1{
    text-align: left;
    padding-bottom: 3px;
    padding-top: 3px; 
    padding-right: 5px;
    font-size: 15px;
    color: white;
    font-weight: bold;
}
#format_err{
    font-weight: bold;
    color: red;
    visibility: hidden;
}
#registration_form {
  font-size: 13px;
  color: #78b5ed;
  line-height: 1.3;
  text-align: left;
}
.registration_p{
    margin-bottom: 10px;
}
#registration_format_err {
  font-weight: bold;
  color: red;
  visibility: hidden;
  line-height: 4;
}
#format_err_name, #format_err_surname, #format_err_registration_email, #format_err_registration_password, #format_err_date, #format_err_place {
    font-weight: bold;
    color: red;
    visibility: hidden;
}

/* -- RIGHT PANEL --*/
.div_button{
    background-color: #1f5191;
    cursor: pointer;
    color: #78b5ed;
    font-size: 15px;
    border-style: none;
    line-height: 1.7;
    font-weight: bolder;
    text-decoration: none;    
}
.div_button:hover{
    color: white;    
}
#menu_buttons{
    text-align: left;
    margin-top: 10px;
    margin-bottom: 25px;
}

/* -- LEFT PANEL -- */
#div_domov{
    padding-left: 5px;
    padding-bottom: 5px;
    padding-right: 15px;
    padding-top: 0px;
    width: 69.2%;
    float: left;        
}
.person{
    font-size: 13px;
    font-weight: bold;
    color: #78b5ed;
    margin-bottom: 10px;
}
.comment{
    background-color: #092e61;           
    color: white;
    margin-bottom: 10px;
}
.picture{
    background-color: #092e61;
    margin-bottom: 10px;
}
.comment:before, .picture:before{
    background: transparent url("Frontpage/top-right.png") scroll no-repeat top right;
    margin-bottom: -20px;
    height: 30px;
    display: block;
    border: none;
    content: url("Frontpage/top-left.png");
    padding: 0px;
    line-height: 0.1;
    font-size: 1px;
}
.comment:after, .picture:after{
    display: block;
    line-height: 0.1;
    font-size: 1px;
    content: url("Frontpage/bottom-left.png");
    margin: 0 0 -1px 0;
    height: 30px;
    background: white;
    background: transparent url("Frontpage/bottom-right.png") scroll no-repeat bottom right;
    padding: 0;
}
.notice{
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 30px;
    padding-right: 30px;
}
.notice img{
    max-width: 100%;
}
.notice a{
    color: #6fade5;
}
#div_tab_notice, #div_moj_profil, #div_prijatelj_profil, #div_isci_prijatelje, #div_moji_prijatelji{
    padding-left: 5px;
    padding-bottom: 5px;
    padding-right: 15px;
    padding-top: 0px;
    width: 69.2%;
    float: left;      
    /* display: none; */
}
.tab_panel{
    height: 240px;
    line-height: 1.5;
}
#write_comment{
    resize: none;    
}
.tab_option{
    font-weight: bold;
    color: #b9daf8;
}
.button_notice{
    margin-top: 40px;
}
#search{
    background-color: #092e61;           
    color: #78b5ed;
    max-width: 100%;
    height: 110px;
    margin-bottom: 10px;
    padding: 30px;
    border-top-left-radius: 13px;
    border-top-right-radius: 13px;
    border-bottom-left-radius: 13px;
    border-bottom-right-radius: 13px;
}
#search_form{
    line-height: 1.5;
    font-size: 15px;
    font-weight: bold;
}
#search_results{
    max-width: 100%;
    min-height: 100px;
    padding-top: 5px;
}
.friend_name, .friend_surname{
    color: #6fade5;
    font-size: 13px;
    font-weight: bolder;
}
.friend_place{
    color: #78b5ed;
    font-weight: bolder;
}
.result, .friend{
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 20px;
    padding-top: 10px;
    line-height: 2;
}
.h1_results{
    color: #1f5191;
    text-decoration: underline;
    font-size: 18px;
    padding-left: 30px;
}
#friends_list{
    min-height: 200px;
    padding-top: 5px;    
}
.friend_t{
    color: #092e61;
}
#friend_text{
    color: #092e61;
    font-size: 14px;
    margin-bottom: 20px;
    margin-top: 10px;
    margin-left: 30px;
}
